@charset "utf-8";
html, body {
    margin: 0;
    width: 100%;
    height: 100%;
    position: relative;
    overflow: hidden;
    font-family: sans-serif;
}
body {
    background: #212121;
	line-height: 1.5;
}
#plexus {
    position: absolute;
    left: 0; bottom: 0; right: 0; top: 0;
    margin: auto;
}
.plexus-line {
    stroke: rgba(59,166,241,.8);
    stroke-width: .5px;
    stroke-linecap: round;
    -webkit-transition: stroke-dashoffset 2s ease-in-out, stroke 1.5s;
    transition: stroke-dashoffset 2s ease-in-out, stroke 1.5s;
}
.form {
    padding: 10px 0 1px;
    background: #fff;
	position: relative;
	z-index: 1;
}
.form > div {
	max-width: 280px;
	margin: auto;
}
.form p {
	margin: .5em 0 1em 2em;
}
[type="radio"] {
	width: 1.5em;
	height: 1.5em;
	vertical-align: -.25em;
	margin-right: .5em;
}
[type="radio"]:not(:checked) ~ p {
    opacity: 0.5;
    pointer-events: none;
}
#letter {
	padding: 4px;
}
.back {
	position: absolute;
	top: 170px; left: 50%;
	padding: 3px 6px;
	background-color: #fff;
	-ms-transform: translateX(-50%);
	transform: translateX(-50%);
	font-size: 14px;
	color: #cd0000;
	text-decoration: none;
	outline: 1px dotted;
}
.back:hover {
	outline: none;
}
@media screen and (min-width: 640px) {
	.back {
		top: 10px;
		margin-left: -250px;
	}
}
